<template>
  <page :better-scroll="true">
    <m-nav-header slot="top"></m-nav-header>
    <topic-banner :bannerList="bannerList"></topic-banner>
    <topic-channels></topic-channels>
    <topic-recommend></topic-recommend>
  </page>
</template>

<script type="text/ecmascript-6">
  import mNavHeader from '../common/nav-header'
  import topicBanner from './topic-banner'
  import topicChannels from './topic-channels'
  import topicRecommend from './topic-recommend'

  export default {
    data() {
      return {
        bannerList: [
          {
            image: require('@/static/images/product/banner1.jpg')
          },
          {
            image: require('@/static/images/product/banner2.jpg')
          }
        ]
      }
    },
    components: {
      mNavHeader,
      topicBanner,
      topicChannels,
      topicRecommend
    }
  }
</script>
